#@weblayout()
#define main()
    <link href="/css/newlist.css" rel="stylesheet" type="text/css">
    <script src="/js/newlist.js" type="text/javascript"></script>

    <div class="newsBox" id="newsBox">
        <div class="newsListBox">
            <div class="tabListBox">
                <div class="tabListBoxC">
                    #for(c : channels)
                        <div class="tabsList #(c.value.toInt()==currentChannel?'active':'')" data-val="#(c.value)"
                            #if(for.index == 0)
                                style="margin-left: 22px;"
                            #end
                        >
                            <span>#(c.name)</span>
                        </div>
                    #end
                    <div class="tabsListC"></div>
                    <div class="juxingBack"></div>
                </div>
                <div class="tabListBoxLine"></div>
            </div>

            <div class="listBox">
                #for(n : newsPage.getList())
                    <div class="lists">
                        <div class="listLeft">
                            <div class="listLeftText1">#(n.time.substring(0,7))</div>
                            <div class="listLeftText2">#(n.time.substring(5,7))月</div>
                        </div>
                        <div class="listRight">
                            #if(n.cover)
                                <div class="listRightPic">
                                    <img src="#(n.cover)" onerror="this.src='/images/anli_3.png'" alt="">
                                </div>
                            #end
                            <div class="rightBoxs" style="padding-left: 160px;">
                                <div class="listRightText1">#(n.title??)</div>
                                <div class="listRightText2">#(n.introduction??)</div>
                                <div class="listRightMore" data-uri="/newsDetail/#(n.id)">READ MORE<i class="fa fa-play"></i></div>
                            </div>
                        </div>
                    </div>
                #end
                <!--<div class="lists">
                    <div class="listLeft">
                        <div class="listLeftText1">2017-09</div>
                        <div class="listLeftText2">9月</div>
                    </div>
                    <div class="listRight">
                        <div class="listRightText1">如何寻找并确立自身的产品定位如何寻找并确立自身的产品定位？</div>
                        <div class="listRightText2">花瓣网, 设计师寻找灵感的天堂!图片素材领导者,帮你采集,发现网络上你喜欢的事物.你可以用它收集灵感,保存有用的素材,计划旅行,晒晒自己想要的东西花瓣网, 设计师寻找灵感的天堂!图片素材领导者,帮你采集,发现网络上你喜欢的事物.你可以用它收集灵感,保存有用的素材,计划旅行,晒晒自己想要的东西</div>
                        <div class="listRightMore">READ MORE<i class="fa fa-play"></i></div>
                    </div>
                </div>
                <div class="lists">
                    <div class="listLeft">
                        <div class="listLeftText1">2017-09</div>
                        <div class="listLeftText2">9月</div>
                    </div>
                    <div class="listRight">
                        <div class="listRightText1">如何寻找并确立自身的产品定位如何寻找并确立自身的产品定位？</div>
                        <div class="listRightText2">花瓣网, 设计师寻找灵感的天堂!图片素材领导者,帮你采集,发现网络上你喜欢的事物.你可以用它收集灵感,保存有用的素材,计划旅行,晒晒自己想要的东西花瓣网, 设计师寻找灵感的天堂!图片素材领导者,帮你采集,发现网络上你喜欢的事物.你可以用它收集灵感,保存有用的素材,计划旅行,晒晒自己想要的东西</div>
                        <div class="listRightMore">READ MORE<i class="fa fa-play"></i></div>
                    </div>
                </div>
                <div class="lists">
                    <div class="listLeft">
                        <div class="listLeftText1">2017-09</div>
                        <div class="listLeftText2">9月</div>
                    </div>
                    <div class="listRight">
                        <div class="listRightText1">如何寻找并确立自身的产品定位如何寻找并确立自身的产品定位？</div>
                        <div class="listRightText2">花瓣网, 设计师寻找灵感的天堂!图片素材领导者,帮你采集,发现网络上你喜欢的事物.你可以用它收集灵感,保存有用的素材,计划旅行,晒晒自己想要的东西花瓣网, 设计师寻找灵感的天堂!图片素材领导者,帮你采集,发现网络上你喜欢的事物.你可以用它收集灵感,保存有用的素材,计划旅行,晒晒自己想要的东西</div>
                        <div class="listRightMore">READ MORE<i class="fa fa-play"></i></div>
                    </div>
                </div>-->
            </div>
            <div class="fenye">
                #@webpaginate(newsPage.pageNumber, newsPage.totalPage, "/news/")
            </div>

        </div>
    </div>
#end